<!doctype html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>大肥羊家政网</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="stylesheet" href="../Xadmin/css/font.css">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <link rel="stylesheet" href="../Xadmin/css/xadmin.css">
    <!-- <link rel="stylesheet" href="./css/theme5.css"> -->
    <script src="../layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../Xadmin/js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script>
        var is_remember = false;
    </script>
</head>
<body>
<div style="margin-left: 10rem;margin-top: 1rem;margin-bottom: 0.5rem">
    邮箱号：
    <div class="layui-inline">
        <input class="layui-input" name="Email" id="Email" autocomplete="off"/>
    </div>
    内容：
    <div class="layui-inline">
        <input class="layui-input" name="Content" id="Content" autocomplete="off"/>
    </div>
    <button class="layui-btn" data-type="reload" onclick="reSearch()">搜索</button>
</div>
<table class="layui-hide" id="Message" lay-filter="Message"></table>

<script type="text/html" id="MessageToolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="ResetMessage">重新发送</button>
        <button class="layui-btn layui-btn-sm" lay-event="lookMessage">查看</button>
        <button class="layui-btn layui-btn-sm" lay-event="upMessage">修改</button>
        <button class="layui-btn layui-btn-sm" lay-event="Reload">刷新</button>
        <button class="layui-btn layui-btn-sm" lay-event="delMessage">删除</button>
    </div>
</script>

<script src="../layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script src="../layui/tool.js"></script>
<script>
    var baseUrl = "http://127.0.0.1:8081/BookName/BookName"
    layui.use('layer', function () {
        console.log('layer导入成功！')
    })
    layui.use('table', function () {//导入table
        var table = layui.table;
        var $ = layui.jquery
        table.render({//生成渲染表格
            elem: '#Message'//表格id
            , url: baseUrl//请求地址
            , toolbar: "#MessageToolbar"//头部工具栏
            , where: {//查询条件
                bookid: ''
                , BName: ''
                , TName: ''
                , jiage: ''
                , IsTrue: ''
            }
            , defaultToolbar: ['filter', 'exports', 'print', {
                title: "提示"
                , layEvent: 'LAYTABLE_TIPS'
                , icon: 'layui-icon-tips'
            }]//表格的头部工具栏
            , title: '邮件列表' //表格标题
            , cols: [[//字段
                {
                    type: 'radio', fixed: 'left' //左对齐的单选框
                },
                {field: 'id', title: 'id', width: 80, fixed: 'left'}
                , {field: 'bookid', title: '书籍id', width: 160, fixed: 'left'}
                , {field: 'BName', title: '书籍名称', width: 160, fixed: 'left'}
                , {field: 'TName', title: '作者', width: 200, fixed: 'left'}
                , {field: 'jiage', title: '价格', width: 80, fixed: 'left'}
                , {field: 'IsTrue', title: '状态', width: 80, fixed: 'left', templet: '#StatusTql'}
            ]]
            , page: true//是否分页
            , limit: 10//每页数量
        });
        //头部工具栏
        table.on('toolbar(Message)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id)//获取当前选中行
            switch (obj.event) {
                case 'ResetMessage'://重新发送
                    var load=layer.load(1,{shade:[0.1,'#fff']});//显示进度条转圈
                    layui.jquery.ajax({
                        url: "http://127.0.0.1:8081/v1/message/ReSendEmail"
                        , method: "get"
                        , data: {
                            id: checkStatus.data[0].id,
                            EmailAddress:checkStatus.data[0].EmailAddress,
                            Note:checkStatus.data[0].Note
                        }
                        , success: function (res) {
                            layer.close(load)
                            var object = JSON.parse(res)
                            if (object.code === '0') {
                                layer.alert("重发成功")
                            } else {
                                layer.alert("重发失败")
                            }
                            reload()
                        }
                    })
                    break;
                case 'upName.html'://查看
                    localStorage.setItem("upMessageid",checkStatus.data[0].id);
                    localStorage.setItem("upMessageEmailAddress",checkStatus.data[0].EmailAddress);
                    localStorage.setItem("upMessageTime",checkStatus.data[0].Time);
                    localStorage.setItem("upMessageNote",checkStatus.data[0].Note);
                    localStorage.setItem("upMessageStatus",checkStatus.data[0].Status);//本地存储
                    layer.open({//打开弹窗
                        type:2,
                        skin:"layui-layer-demo",
                        title:"查看标题",//弹窗标题
                        anim:2,//打开类型
                        area:["50%","50%"],//框高
                        shadeClose:true,//是否有关闭按期
                        content:"upMessage.html",//显示的网页
                        end:function () {//关闭后的回调
                            reload()
                        }
                    })

                    break;
                case 'lookMessage'://查看
                    localStorage.setItem("lookMessageid",checkStatus.data[0].id);
                    localStorage.setItem("lookMessageEmailAddress",checkStatus.data[0].EmailAddress);
                    localStorage.setItem("lookMessageTime",checkStatus.data[0].Time);
                    localStorage.setItem("lookMessageNote",checkStatus.data[0].Note);
                    localStorage.setItem("lookMessageStatus",checkStatus.data[0].Status);//本地存储
                    layer.open({//打开弹窗
                        type:2,
                        skin:"layui-layer-demo",
                        title:"查看标题",//弹窗标题
                        anim:2,//打开类型
                        area:["50%","50%"],//框高
                        shadeClose:true,//是否有关闭按期
                        content:"lookMessage.html",//显示的网页
                        end:function () {//关闭后的回调
                            reload()
                        }
                    })

                    break;
                case 'delMessage'://删除信息
                    layui.jquery.ajax({
                        url: baseUrl
                        , method: "delete"
                        , data: {
                            id: checkStatus.data[0].id
                        }
                        , success: function (res) {
                            var object = JSON.parse(res)
                            if (object.code === '0') {
                                layer.alert("删除成功")
                            } else {
                                layer.alert("删除失败")
                            }
                            reload()
                        }
                    })
                    break;
                case 'Reload':
                    reload();
                    break;
            }
        })
    })

    function reload() {//刷新表格
        var table = layui.table;
        table.reload('Message', {
            url: baseUrl,
            request: {
                pageName: 'page' //页码的参数名称，默认是page
                , limitName: 'limit'//每页的数量参数名称 默认是limit
            },
            where: {//查询条件
                EmailAddress: ''
                , Note: ''
            },
            page: {//当前显示的页码
                curr: 1
            }

        })
    }
    function reSearch() {//查询数据
        var table = layui.table;
        table.reload('Message', {
            url: baseUrl,
            request: {
                pageName: 'page' //页码的参数名称，默认是page
                , limitName: 'limit'//每页的数量参数名称 默认是limit
            },
            where: {//查询条件
                EmailAddress: $("#Email").val()
                , Note: $("#Content").val()
            },
            page: {//当前显示的页码
                curr: 1
            }

        })

    }
</script>
</body>
<script type="text/html" id="StatusTql">  <!--状态模板 -->
{{# if(d.IsTrue === '0'){ }}
<span style="color:green">没有借出</span>
{{# }else { }}
<span style="color:red">成功借出</span>
{{# } }}
</script>
</html>